/**
 * 调用搜人接口的成员选择器
 */

import React from 'react';
import PropTypes from 'prop-types';
import AtUserSelect from 'atComponents/AtUserSelect';

import exceed from 'utils/apimap';

export default class UserSelect extends React.Component {
  static propTypes = {
    disabled: PropTypes.bool,
    multiple: PropTypes.bool,
    projectId: PropTypes.number,

    onChange: PropTypes.func,
  };

  constructor(props) {
    super(props);
    this.state = {
      // disabled: false,
      // multiple: false,
    };
  }

  resultFormat = (data) => {
    return data.map((item) => ({
      nickname: item.name,
      realname: item.username,
      staffId: item.extern_uid,
      thumbnail: item.avatar_url,
      department: '',
      userid: item.id,
    }));
  };

  render() {
    // console.log(this.props.value);
    const { disabled, onChange, mode, projectId, valueColumn, ...others } = this.props;
    const apiParams = {
      project_id: projectId,
    };
    return (
      <AtUserSelect
        style={{ minWidth: 190 }}
        disabled={disabled}
        extra={apiParams}
        mode={mode}
        column={{ value: valueColumn || 'userid', label: 'nickname' }}
        exceed={exceed}
        api="search.users"
        onChange={onChange}
        resultFormat={this.resultFormat}
        {...others}
      />
    );
  }
}
